import React from 'react'
import _ from 'underscore'
import format from 'lib/util/format'
import GridWidget from 'lib/components/GridWidget.jsx'
import moment from 'moment'
import numeral from 'numeral'

import tips from '../common/indicator-tips.jsx'

export default class UserAddedGrid extends GridWidget {
  constructor(props){
    super(props)
  }
}
UserAddedGrid.defaultProps = _.extend({}, GridWidget.defaultProps, {
  extraClassName: 'table-layout',
  oddColor: true,
  cols: [
    {
      title: '日期',
      key: 'date',
      render: function (fmtVal,rowData) {
        return this.props.formatType === 'daily'
          ? moment(rowData.startTime).format('YYYY-MM-DD')
          : moment(rowData.startTime).format('YYYY-MM-DD') + ' ~ ' + moment(rowData.endTime).subtract(1, 'days').format('YYYY-MM-DD');
      }
    }, {
      title: (
        <span>
          新增用户
          <i className="iconfont iconfont-tip" data-tip="第一次启动应用的用户（以设备为判断标准）<br />按日，周或月查看数据<br />可进行版本，渠道的交叉筛选。">
            &#xe663;
          </i>
        </span>
      ),
      key: 'val'
    }, {
      title: (
        <span>
          新增用户占比
          <i className="iconfont iconfont-tip" data-tip="某时段内新增用户占该时段活跃用户的比例。">&#xe663;
          </i>
        </span>
      ),
      key: 'rate',
      formatter: (v) => {
        return v !== undefined ? numeral(v).format('0.00%') : '--';
      }
    }
  ]
})
